<template>
  <div class="saleReport">
    <el-tabs v-model="activeName">
      <el-tab-pane name="grossMargin" :label="$t('market.hznml')">
        <grossMargin :msg="1" /> <!--惠州内销毛利报表-->
      </el-tab-pane>
      <el-tab-pane name="grossMargin1" :label="$t('market.xcwgcpml')">
        <grossMargin :msg="0" /><!--销售外购成品毛利报表-->
      </el-tab-pane>
      <!--      <el-tab-pane name="purchasePrice" :label="$t('market.xccg')">-->
      <!--        <purchasePrice />&lt;!&ndash;销售采购报表&ndash;&gt;-->
      <!--      </el-tab-pane>-->
      <el-tab-pane v-if="false" name="salesPrice" :label="$t('market.xcdj')">
        <salesPrice /><!--销售单价报表-->
      </el-tab-pane>
      <el-tab-pane name="priceList" :label="$t('market.xcjmyl')">
        <priceList /><!--销售价目一览表-->
      </el-tab-pane>
      <el-tab-pane :label="$t('market.salesDealWith')" name="salesDealWith">
        <salesDealWith /><!--销售应收报表-->
      </el-tab-pane>
      <el-tab-pane name="sellingCost" :label="$t('market.sellingCost')">
        <sellingCost /><!--销售出库毛利分析报表-->
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
export default {
  name: 'SaleReport',
  components: {
    salesDealWith: () => import('@/views/financial/statements/salesDealWith'),
    grossMargin: () => import('@/views/market/baoBiao/grossMargin'), // 销售毛利
    priceList: () => import('@/views/market/baoBiao/priceList'),
    // purchasePrice: () => import('@/views/market/baoBiao/purchasePrice'),
    salesPrice: () => import('@/views/market/baoBiao/salesPrice'),
    sellingCost: () => import('@/views/financial/statements/sellingCost')
  },
  data() {
    return {
      activeName: 'grossMargin' // tab name
    }
  }
}
</script>

<style scoped lang="scss">
.saleReport {
  @include listBom;
  .el-tabs::v-deep .el-tabs__nav-next,
  .el-tabs::v-deep .el-tabs__nav-prev {
    line-height: 28px;
    font-size: 14px;
  }
  .el-table {
    &::v-deep thead.is-group th {
      padding: 5px 0;
    }
  }
}
.btn1 {
  margin-left: 450px !important;
}

.el-dialog .el-dialog__body{
  //text-align: center;
}
.iframe-content {
  margin: 20px 0;
  display: flex;
  justify-content: center;
}

.el-form {
  display: flex;
}
.productImg{
  height: auto;
  max-height: 30px;
}
.image{
  width: auto;
  height: 100%;
  max-height: 600px;
}
</style>
